<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        img{
            width: 50px;
        }
    </style>
</head>
<body>
<input type="text" placeholder="数量" id="i1">
<input type="button" value="帅哥" onclick="fn(1)">
<input type="button" value="美女" onclick="fn(2)">
<div></div>

<script>
    function fn(x) {
        let imgName= x==1?"帅哥.jpg":"美女.webp";

        let d=document.querySelector("div");
        let i1=document.querySelector("#i1");
        if(isNaN(i1.value)||i1.value==""){
            alert("输入错误");
            return;
        }
        // d.innerHTML="";
        for (let i = 0; i <i1.value ; i++) {
            d.innerHTML+="<img src='"+imgName+"'>";
        }
    }
</script>

</body>
</html>